<template>
  <v-card title="瀑布图">
    <vcu-chart-bar :data="chartData" :settings="settings" />
  </v-card>
</template>

<script>
export default {
  name: 'waterfall',
  data() {
    return {
      chartData: {
        dimensions: {
          name: '费用',
          data: ['总费用', '房租', '水电费', '交通费', '伙食费', '日用品数'],
        },
        measures: [
          {
            name: 'secondaryMeasure',
            data: [0, 1700, 1400, 1200, 300, 0],
          },
          {
            name: '生活费',
            data: [2900, 1200, 300, 200, 900, 300],
          },
        ],
      },
      settings: {
        stack: {
          总量: ['生活费', 'secondaryMeasure'],
        },
        label: [
          {
            name: '生活费',
            show: true,
            fontWeight: 'bold',
            position: 'inside',
          },
        ],
        waterfall: true,
        tooltipFormatter: function (params) {
          let tar = params[1]
          return tar.name + '<br/>' + tar.seriesName + ' : ' + tar.value[2]
        },
      },
    }
  },
  methods: {},
  created() {},
}
</script>
<style lang="less" scoped>
</style>